<template>
  <div>
    <div class="container">
      <div class="container-content">
        <div class="ue">
          <div class="conten_tit">
            <div class="tit_date">
              <p>体检编号</p>
              <input
                type="text"
                v-model="user.Get_CheckSub_Data1.Check_No"
                :disabled="isDisabled"
              />
            </div>
            <div class="tit_date">
              <p>体检日期</p>
              <input
                type="text"
                v-model="user.Get_CheckSub_Data1.Check_Date"
                :disabled="isDisabled"
              />
            </div>
            <div class="tit_date">
              <p>姓名</p>
              <input
                type="text"
                v-model="user.Get_CheckSub_Data1.Pson_Name"
                :disabled="isDisabled"
              />
            </div>
            <div class="tit_date">
              <p>年龄</p>
              <input
                type="text"
                v-model="user.Get_CheckSub_Data1.Pson_Age"
                :disabled="isDisabled"
              />
            </div>
            <div class="tit_date">
              <p id="tp">身份证</p>
              <input
                type="text"
                id="te"
                v-model="user.Get_CheckSub_Data1.Pson_CardID"
                :disabled="isDisabled"
              />
            </div>
            <div class="tit_date">
              <p>人群类型</p>
              <input
                type="text"
                v-model="user.Get_CheckSub_Data1.Pson_Type"
                :disabled="isDisabled"
              />
            </div>
          </div>
        </div>
        <div class="title">
          <span class="t1">
            你的主要体质为:
            <p class="p1">{{ this.show }}</p>
            偏颇程度为
            <p>{{ this.shows }}</p>
          </span>
        </div>
        <div>
          <div class="xxdf"><h1>详细得分</h1></div>
          <div class="content">
            <div v-for="item in content" :key="item.Tz_Id" class="c1">
              <span class="t2">
                <h>{{ item.Tz_Name }}:</h>
                <p>{{ item.Rlt_Score }}分</p>
              </span>
            </div>
          </div>
        </div>
        <div class="bt">
          <button @click="save">保存评估</button>
          <button @click="cxpg">重新评估</button>
        </div>
      </div>
    </div>
    <!-- 更多进度条 -->
  </div>
</template>

<script>
import { showDialog } from "vant";
import { userStore } from "../../stores/user.ts";
export default {
  data() {
    return {
      user: "",
      content: "",
      isDisabled: true,
      phz1: "",
      show: "",
      arr: [],
      shows: "",
      end: [],
    };
  },
  created() {
    this.user = userStore();
    this.Interface_Code = sessionStorage.getItem("item");
    this.User_Code = JSON.parse(sessionStorage.getItem("UserInfo")).sUser_Code;
    this.df();
  },
  computed: {
  },
  methods: {
    getend() {
      this.content.forEach((item) => {
        console.log(item);
        if (item.Tz_Name == this.show) {
          this.end = item;
          console.log("111111");
          console.log(this.end);
        }
      });
    },
    getqqs() {
      this.user.yclist.forEach((item) => {
        if (item.Tz_Name == this.show) {
          this.shows = item.Rlt_ChkStr;
        }
      });
    },
    sortedItems() {
      // 使用Array.prototype.sort方法进行排序
      this.arr = this.arr.sort((a, b) => a.Rlt_Score - b.Rlt_Score);
      console.log(this.arr);
    },
    getphz() {
      var newArr2 = [];
      this.content.forEach(function (item, suffix) {
        //根据对象的属性是唯一的，将值作为对象的属性名
        if (item.Tz_Name == "平和质") {
          var arr2 = [];
          arr2.push(item);
          newArr2.push(arr2);
        }
      });
      this.phz1 = newArr2;
      var newArr3 = [];
      this.content.forEach(function (item, suffix) {
        //根据对象的属性是唯一的，将值作为对象的属性名
        if (item.Tz_Name !== "平和质") {
          var arr3 = [];
          arr3.push(item);
          newArr3.push(arr3);
        }
      });
      this.phz2 = newArr3;
    },
    df() {
      axios
        .post(
          window.globalUrl.server + "Service.asmx/GetZytz_Group_Rlt",
          JSON.stringify({
            User_Code: this.User_Code,
            Interface_Code: this.Interface_Code,
            Check_No: this.user.Get_CheckSub_Data1.Check_No,
          })
        )
        .then((res) => {
          this.content = JSON.parse(res.data.RltData);
          this.getphz();
          console.log(this.phz1);
          console.log(this.phz2);
          console.log(JSON.parse(res.data.RltData));
          if (this.phz1[0][0].Rlt_Score >= 17) {
            var arr = [];
            this.phz2.forEach((item) => {
              if (item[0].Rlt_Score >= 10) {
                arr.push(item[0]);
                this.show = "平和质";
                console.log("123");
              } else if (item[0].Rlt_Score <= 8) {
                this.show = "平和质";
                this.getqqs();
                // this.getend()
              } else if (8 < item[0].Rlt_Score <= 10) {
                arr.push(item[0]);
              }
              this.arr = arr;
            });
            this.sortedItems();
            this.show = this.arr[this.arr.length - 1].Tz_Name;
            // this.getend()
            this.getqqs();
          } else if (this.phz1[0][0].Rlt_Score < 17) {
            console.log(this.phz1[0][0].Rlt_Score);
            var arr = [];
            this.phz2.forEach((item) => {
              if (item[0].Rlt_Score >= 10) {
                arr.push(item[0]);
                console.log(item[0].Tz_Name);
              }
              this.arr = arr;
            });
            this.sortedItems();
            this.show = this.arr[this.arr.length - 1].Tz_Name;
            // this.getend()
            this.getqqs();
            console.log(this.arr[("1111", this.arr.length - 1)].Tz_Name);
          }
        });
    },
    save() {
      this.getend();
      axios
        .post(
          window.globalUrl.server + "Service.asmx/Zytz_Result_Update",
          JSON.stringify({
            User_Code: this.User_Code,
            Interface_Code: this.Interface_Code,
            Check_No: this.user.Get_CheckSub_Data1.Check_No,
            Tz_Id: this.end.Tz_Id,
            Tz_Name: this.end.Tz_Name + this.shows,
            Rlt_Score: this.end.Rlt_Score,
            Pson_Name: this.user.Get_CheckSub_Data1.Pson_Name,
            Pson_Age: this.user.Get_CheckSub_Data1.Pson_Age,
            Check_Date: this.user.Get_CheckSub_Data1.Check_Date,
            Pson_Sex: this.user.Get_CheckSub_Data1.Pson_Sex,
            Pson_Tel: this.user.Get_CheckSub_Data1.Pson_Tel,
            Pson_CardID: this.user.Get_CheckSub_Data1.Pson_CardID,
            Pson_Addr: this.user.Get_CheckSub_Data1.address,
            Pson_Tag: this.user.Get_CheckSub_Data1.Pson_Tag,
            Check_Package: "",
          })
        )
        .then((res) => {
          if (res.data.RltCode === 1) {
            // alert("中医体质结果信息保存成功")
            showDialog({
              message: "中医体质提交成功。",
              theme: "round-button",
            })
              .then(() => {
                console.log("111");
                this.user.Get_CheckSub_Data1 = {};
                this.user.yclist=[]
                this.user.optionser=[]
                this.user.Tz_End={}
                sessionStorage.removeItem("data1");
                sessionStorage.removeItem("file");
                sessionStorage.removeItem("yc");
                sessionStorage.removeItem("xq");
                sessionStorage.removeItem("Tz_End");
                
                this.$router.push("/souye");
              })
              .catch(() => {
                console.log("222");
              });
          }
        });
    },
    cxpg() {
       this.user.yclist=[]
      this.user.optionser=[]
      sessionStorage.removeItem("file");
      sessionStorage.removeItem("yc");
      this.$router.push("/souye");
    },
  },
};
</script>
<style scoped>
#tp {
  margin-left: 22px;
}
input {
  border: 1px solid black;
  border-radius: 0px;
  box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.5);
  margin-left: 12px;
}
.tit_date {
  font-size: 14px;
  line-height: 22px;
  color: #86909c;
  margin-left: 60px;
  display: flex;
  margin-top: 8px;
}
.conten_tit {
  display: flex;
  height: 75px;
  flex-wrap: wrap;
  flex-direction: column;
}
.ue {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 1000;
  background-color: #d3c3a9;
}
.container {
  width: 100%;
  height: 100%;
  background-color: bisque;
  display: flex;
  justify-content: center;
  align-items: center;
}
.container-content {
  width: 100%;
  height: 100%;
  background-color: #efeade;
}
.title {
  display: flex;
  padding-top: 75px;
  height: 200px;
  border: 1px solid;
}
.t1 {
  display: flex;
  font-size: 22px;
}
.t2 {
  display: flex;
  font-size: 22px;
  justify-content: center;
  margin-top: 10px;
}
p {
  font-size: 20px;
  border-bottom: 1px solid;
}
.p1 {
  margin-right: 70px;
}
.p2 {
  margin-right: 70px;
}
.content {
  display: flex;
  flex-wrap: wrap;
}
.c1 {
  width: 33%;
}
h1 {
  margin: 0 auto;
  font-weight: 900;
}
.xxdf {
  display: flex;
  justify-content: center;
  height: 100px;
  align-items: center;
  font-size: 22px;
}
button {
  margin-top: 20px;
  margin-bottom: 20px;
  font-size: 20px;
  height: 50px;
  width: 100px;
  background-color: #917155;
  color: #ffffff;
  margin-right: 18px;
  border: none; /* 去掉边框 */
  color: white; /* 文字颜色 */
  /* padding: 15px 32px;  */
  text-align: center; /* 文字居中 */
  text-decoration: none; /* 去掉下划线 */
  display: inline-block; /* 使其成为行内块元素 */
  font-size: 16px; /* 字体大小 */
  cursor: pointer; /* 鼠标悬停时显示指针形状 */
  border-radius: 5px; /* 圆角边框 */
  transition: background-color 0.3s, color 0.3s; /* 过渡效果 */
}
.bt {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 200px;
}
@media screen and (orientation: portrait) {
  .portrait {
    /* 竖屏样式 */
  }
  .container {
    height: 100vh;
  }
}
</style>
